HTML Структура страницы
HTML — это основа построения любого сайта! При изучении темы сайтостроения необходимо начинать именно с него.
✔ Что такое тег в HTML?
— Немного о теории. Любая страница состоит из тегов. То есть страница выглядит на самом деле не так как мы привыкли это видеть, а состоит из множества тегов, каждый из которых, играет определенную роль.
Что такое HTML ? — Это элемент страницы, который так или иначе влияет на отображение и разметку страницы. На словах понять это достаточно сложно, поэтому необходимо сразу все смотреть именно на практике и привыкать к коду. Посмотрите на изображение ниже
Это структура самой простой страницы. А вот эти повторяющиеся слова в треугольных скобках — это и есть теги. Если Вы откроете свой текстовый редактор и напишете данный код, а затем сохраните в формате HTML, то у Вас получится HTML страничка.
Из этой структуры можно увидеть те теги, которые должны обязательно присутствовать на любой HTML странице.
Вот эти теги:
<html> Открытый тег и закрытый. </html> <head> Открытый тег и закрытый. </head> <body> Открытый тег и закрытый. </body>
Что бы было более понятно, обратите внимание на фото (картинку), где теги представлены в общем обзоре.
Все, что мы будем писать между тегами <head> и </head> мы не увидим на нашей странице. Эти теги могут сообщать браузеру о кодировке, о заголовке нашей страницы, здесь могут подключить различные стили, скрипты и так далее.
А вот все теги, которые мы будем писать между тегами <body> и </body>, в зависимости от его предназначения, будет влиять именно на структуру нашей HTML страницы.
Некоторые теги могут иметь закрывающий тег, а некоторые нет. Например тега <body> есть закрывающий тег </body.>
Закрываются теги с помощью наклонной черты.
Очень важно соблюдать открытие и закрытие тегов. Чтобы не было ошибок.
Браузер ошибку может и не показать, а вот структура Вашей страниц будет неправильной и при дальнейшей работе со стилями (где займемся внешним видом) будут большие проблемы.
Поэтому если у тега есть закрывающий тег, то он обязательно должен присутствовать в правильном месте.
Давайте на примере разберем как НЕ надо закрывать теги и в каком порядке это необходимо делать.
Пример двух тегов:
Правильный HTML код: <div><p>Произвольный любой текст.</p></div> НЕ Правильный HTML код: <div><p>Произвольный любой текст.</div></p>
Как видно из примера « Pазница на лицо. » Так закрывать теги категорически запрещается!
Поближе узнать, что такое HTML , можно лишь на практике. Для этого можно использовать любой текстовый редактор. Даже блокнот. Но я рекомендую использовать Notepad++, потому что функци для работы с HTML здесь гораздо больше. В данном редакторе есть все возможности для создания и редактирования HTML страниц.
✔ Описание тегов
<html></html> — эти теги должны присутствовать на странице обязательно.
<body></body> — между этими тегами заключается весь видимый контент страницы.
<head></head> — внутри этих тегов должны располагаться все заголовочные теги. Этот раздел можно опустить, но я не советую это делать, поскольку это важная часть документа, особенно для поисковых систем.
<title></title> — между этими тегами прописывается заголовок страницы, которое отображается в самом вверху браузера. Кстати, когда Вы что-то ищите в поисковиках, то первое, что отображается, это как раз название страницы.
<center></center> — эти теги выравнивают все, что находится внутри них по центру. В данном случае центром будет - центр экрана.
<br /> — это одиночный тег, который не требует закрывающего тега. Он осуществляет переход на следующую строку. В моем примере написаны два одиночных тега подряд, чтобы дважды перейти на следующую строку.
<font></font> — эти теги созданы для изменения шрифта, фона, размера и т.д. Короче говоря, все, что связано с форматированием текста можно настроить в одном теге. Это тег имеют довольно много атрибутов
<span></span> — эти теги предназначены для определения строчных элементов документа.
<b></b> — выделить жирным. Все, что заключено между этими тегами будет выделено жирным. Например, если Вы напишите его в самом начале контента, а закроете в самом конце, то весь текст на странице будет выделен жирным. Это довольно часто встречающийся тег, аналогом которого является <strong></strong> Поисковые системы обращают внимание на этот тег в плане усиления влияение ключевых слов. Но нужно быть аккуратным, поскольку выделять каждый раз жирным ключевые слова будет воспринято за спам.
<hr/> — это одиночный тег, который выводит горизонтальную линию. Имеет несколько параметров, проще говоря это разделитель. Изменяя значение от 1 будет изменяться размер разделителя.
<h1></h1> — это один из класса тегов заголовочных тегов от1 до 6.Обычно в него заключают название страницы. При составлении html-кода нужно придерживаться простого правила: сначала должен идти заголовочный тег h1, а дальше могут идти уже h2, h3 и т.д. Главное, чтобы это не было на оборот.
<img alt="Наз.Картинки" src="URL_ИЗОБPАЖЕНИЯ"> — это одиночный тег, который выводит изображение. В параметры Alt и title можно записать описание к Вашему изображению. Когда Вы наведете мышкой на изображение, то появится это описание. Эти параметры важны для продвижения сайта, особенно в поиске по картинкам.
Важно знать! Для создания HTML страницы не требуется никаких специальных программ. Подойдет любой текстовый редактор умеющий сохранять файлы в обычном текстовом формате.
Таким редактором, например, являются Notepad (Блокнот), входящий в стандартные средства Windows.
Внимание!
Остались вопросы после прочтения статьи или есть что сказать? Оставляйте свои комментарии:► Оставить коментарий:
Имя: Ваш вопрос:
Леонид Пивторак (Администратор.)
Ответ на вопрос:
Pубрики: